import React, {Component} from 'react'
import { Link } from 'react-router'
import './sm-extend.min.css'
import './sm.min.css'
import './index.css'
import Barnav from './barnav'
import $ from 'jquery'

class Regpage extends Component{
	constructor(){
		super();
	}
	reg(){
		let username = this.refs.username.value
		let password = this.refs.password.value
		let cfpassword = this.refs.cfpassword.value
		let data={
			username:username,
			password:password,
			cfpassword:cfpassword
		}
		if(password!=cfpassword){
			alert('两次输入密码不正确');
		}else if(username==""||password==""||cfpassword==""){
			alert('请将信息填写完整');
		}else{
			$.post('http://127.0.0.1:8080/reg',data,function(data,textStatus,xhr){
				if(String(data)=="success"){
					alert('注册成功');
					window.location.href="http://127.0.0.1:3000/log"
				}else{
					alert('用户已被注册');
				}
			})
		}
	}
	render(){
		return(
				<div>
				<Barnav/>
			<div className="content">
				<img src="../images/logo.png" className="logo" />
		<div className="list-block regPage">
			<ul>

				<li>
					<div className="item-content">
						<div className="item-media"><i className="icon icon-form-email"></i></div>
							<div className="item-inner">
							<div className="item-title label greyfont" ref="username">邮箱</div>
							<div className="item-input">
						<input type="email" placeholder="E-mail" name="email" id="email" ref="username" />
						</div>
						</div>
					</div>
				</li>
			<li>
				<div className="item-content" >
				<div className="item-media"><i className="icon icon-form-email"></i></div>
				<div className="item-inner">
				<div className="item-title label greyfont">密码</div>
				<div className="item-input">
				<input type="password" placeholder="password" name="password" id="regpassword" ref="password"/>
				</div>
				</div>
				</div>
			</li>
			<li>
				<div className="item-content">
				<div className="item-media"><i className="icon icon-form-email"></i></div>
				<div className="item-inner">
				<div className="item-title label greyfont">确认密码</div>
				<div className="item-input">
				<input type="password" placeholder="password" ref="cfpassword"/>
				</div>
				</div>
				</div>
			</li>
			</ul>
			</div>

			<div className="content-block">
			<div className="row">
			<div className="col-50"><a className="button button-big button-fill button-danger" >取消</a></div>
		<div className="col-50"><a className="button button-big button-fill button-success" id="zhuce" ref="zhuce" onClick={this.reg.bind(this)}>注册</a></div>
		</div>
		</div>

		</div>
		</div>
		)

	}

}


export default Regpage